$utilities: () !default;
$utilities: map-deep-merge(
  (
    // Display utilities
      //   'overflow':
      //   (
      //     property: overflow,
      //     values: auto hidden visible
      //   ),
      // 'overflow-x': (
      //   property: overflow-x,
      //   values: auto hidden
      // ),
      // 'overflow-y': (
      //   property: overflow-y,
      //   values: auto hidden
      // ),
      'display':
      (
        responsive: true,
        print: true,
        property: display,
        class: d,
        values: none inline inline-block block table table-row table-cell flex
          inline-flex
      ),
    'float': (
      responsive: true,
      print: true,
      property: float,
      class: float,
      values: none left right
    ),
    // Flex utilities
      'flex':
      (
        responsive: true,
        property: flex,
        values: (
          fill: 1 1 auto
        )
      ),
    'flex-direction': (
      responsive: true,
      property: flex-direction,
      class: flex,
      values: row column row-reverse column-reverse
    ),
    'flex-grow': (
      responsive: true,
      property: flex-grow,
      class: flex,
      values: (
        grow-0: 0,
        grow-1: 1
      )
    ),
    'flex-shrink': (
      responsive: true,
      property: flex-shrink,
      class: flex,
      values: (
        shrink-0: 0,
        shrink-1: 1
      )
    ),
    'flex-wrap': (
      responsive: true,
      property: flex-wrap,
      class: flex,
      values: wrap nowrap wrap-reverse
    ),
    'justify-content': (
      responsive: true,
      property: justify-content,
      class: justify,
      values: (
        start: flex-start,
        end: flex-end,
        center: center,
        space-between: space-between,
        space-around: space-around
      )
    ),
    'align-items': (
      responsive: true,
      property: align-items,
      class: align,
      values: (
        start: flex-start,
        end: flex-end,
        center: center,
        baseline: baseline,
        stretch: stretch
      )
    ),
    'align-content': (
      responsive: true,
      property: align-content,
      values: (
        start: flex-start,
        end: flex-end,
        center: center,
        space-between: space-between,
        space-around: space-around,
        stretch: stretch
      )
    ),
    'align-self': (
      responsive: true,
      property: align-self,
      values: (
        auto: auto,
        start: flex-start,
        end: flex-end,
        center: center,
        baseline: baseline,
        stretch: stretch
      )
    ),
    'order': (
      responsive: true,
      property: order,
      values: (
        first: -1,
        0: 0,
        1: 1,
        2: 2,
        3: 3,
        4: 4,
        5: 5,
        6: 6,
        7: 7,
        8: 8,
        9: 9,
        10: 10,
        11: 11,
        12: 12,
        last: 13
      )
    ),
    'margin': (
      responsive: ture,
      property: margin,
      class: ma,
      values:
        map-merge(
          $spacers,
          (
            auto: auto
          )
        )
    ),
    'margin-x': (
      responsive: true,
      property: margin-right margin-left,
      class: mx,
      values:
        map-merge(
          $spacers,
          (
            auto: auto
          )
        )
    ),
    'margin-y': (
      responsive: true,
      property: margin-top margin-bottom,
      class: my,
      values:
        map-merge(
          $spacers,
          (
            auto: auto
          )
        )
    ),
    'margin-top': (
      responsive: true,
      property: margin-top,
      class: mt,
      values:
        map-merge(
          $spacers,
          (
            auto: auto
          )
        )
    ),
    'margin-right': (
      responsive: true,
      property: margin-right,
      class: mr,
      values:
        map-merge(
          $spacers,
          (
            auto: auto
          )
        )
    ),
    'margin-bottom': (
      responsive: true,
      property: margin-bottom,
      class: mb,
      values:
        map-merge(
          $spacers,
          (
            auto: auto
          )
        )
    ),
    'margin-left': (
      responsive: true,
      property: margin-left,
      class: ml,
      values:
        map-merge(
          $spacers,
          (
            auto: auto
          )
        )
    ),
    // Negative margin utilities
      'negative-margin':
      (
        responsive: true,
        property: margin,
        class: ma,
        values: $negative-spacers
      ),
    'negative-margin-x': (
      responsive: true,
      property: margin-right margin-left,
      class: mx,
      values: $negative-spacers
    ),
    'negative-margin-y': (
      responsive: true,
      property: margin-top margin-bottom,
      class: my,
      values: $negative-spacers
    ),
    'negative-margin-top': (
      responsive: true,
      property: margin-top,
      class: mt,
      values: $negative-spacers
    ),
    'negative-margin-right': (
      responsive: true,
      property: margin-right,
      class: mr,
      values: $negative-spacers
    ),
    'negative-margin-bottom': (
      responsive: true,
      property: margin-bottom,
      class: mb,
      values: $negative-spacers
    ),
    'negative-margin-left': (
      responsive: true,
      property: margin-left,
      class: ml,
      values: $negative-spacers
    ),
    // Padding utilities
      'padding':
      (
        responsive: true,
        property: padding,
        class: pa,
        values: $spacers
      ),
    'padding-x': (
      responsive: true,
      property: padding-right padding-left,
      class: px,
      values: $spacers
    ),
    'padding-y': (
      responsive: true,
      property: padding-top padding-bottom,
      class: py,
      values: $spacers
    ),
    'padding-top': (
      responsive: true,
      property: padding-top,
      class: pt,
      values: $spacers
    ),
    'padding-right': (
      responsive: true,
      property: padding-right,
      class: pr,
      values: $spacers
    ),
    'padding-bottom': (
      responsive: true,
      property: padding-bottom,
      class: pb,
      values: $spacers
    ),
    'padding-left': (
      responsive: true,
      property: padding-left,
      class: pl,
      values: $spacers
    ),
    // Text
      'text-align':
      (
        responsive: true,
        property: text-align,
        class: text,
        values: left right center justify start end
      )
  ),
  $utilities
);
